{% extends "public/layout.html" %}

{% block body %}
    <link rel="stylesheet" href="/static/css/dataTables.bootstrap.css" type="text/css" >
<style>
    .NoNewline {  word-break: keep-all;  }
.server_list_button{float:right; margin-right: 10px;margin-bottom: 10px;}
#host_list{ height: 250px; overflow-y: scroll;border:1px solid #ccc; width:220px;padding-left:10px;float:left;margin-right:20px;}
    .modal-body{min-height: 280px;}
    #zabbix_group{width:200px;}
</style>
<div class="right_content">

<a href="/resources/server/add" style="float:right" class="btn btn-default server_list_button" role="button">添加服务器</a>
<input class="btn btn-default server_list_button" id="server_to_zabbix_btn" type="button" value="同步到zabbix">

<div id="tab_box" >
    <table id="table_id" class="table table-striped table-bordered" cellspacing="0" width="100%">
      <thead>
        <tr>
          <th>#</th>
          <th>供应商</th>
          <th>制造商</th>
          <th>出厂日期</th>
          <th>服务器型号</th>

          <th>ST号</th>
          <th>UUID</th>
          <th>自定义资产号</th>
          <th>IDC</th>
          <th>机柜号</th>

          <th>位置</th>
          <th>到保日期</th>
          <th>UPS电源</th>
          <th>合作商</th>
          <th>合作方式</th>

          <th>机器上架日期</th>
          <th>操作系统</th>
          <th>主机名</th>
          <th>内网IP</th>

          <th>MAC地址</th>
          <th>IP信息</th>
          <th>CPU型号</th>
          <th>硬盘信息</th>
          <th>内存信息</th>

          <th>RAID卡类型</th>
          <th>RAID卡型号</th>
          <th>远程管理卡类型</th>
          <th>远程管理卡IP</th>
          <th>服务器状态</th>

          <th>备注</th>
          <th>最后操作时间</th>
          <th>最后操作人</th>
          <th>业务线</th>
          <th>产品线</th>

          <th>故障处理人</th>
          <th>开发接口人</th>
          <th>运维接口人</th>
          <th>上次检测时间</th>
          <th>电源功率</th>

        </tr>
      </thead>
      <tbody>

            {% for server in servers %}
                <tr>
                <td> {{ loop.index }} </td>
                <td> {{ server.supplier }} </td>
                <td> {{ server.manufacturers }} </td>
                <td> {{ server.manufacture_date }} </td>
                <td> {{ server.server_type }} </td>

                <td> {{ server.st }} </td>
                <td> {{ server.uuid }} </td>
                <td> {{ server.assets_no }} </td>
                <td> {{ server.idc_id }} </td>
                <td> {{ server.cabinet_id }} </td>

                <td> {{ server.cabinet_pos }} </td>
                <td> {{ server.expire }} </td>
                <td> {% if server.ups %} 有 {% else %} 无 {% endif %} </td>
                <td> {{ server.parter }} </td>
                <td> {{ server.parter_type }} </td>

                <td> {{ server.server_up_time }} </td>
                <td> {{ server.os }} </td>
                <td> {{ server.hostname }} </td>
                <td> {{ server.inner_ip }} </td>

                <td> {{ server.mac }} </td>
                <td> {{ server.ipinfo }} </td>
                <td> {{ server.server_cpu }} </td>
                <td> {{ server.server_disk }} </td>
                <td> {{ server.server_mem }} </td>

                <td> {{ server.raid }} </td>
                <td> {{ server.raid_card_type }} </td>
                <td> {{ server.remote_card }} </td>
                <td> {{ server.remote_cardip }} </td>
                <td> {{ server.status }} </td>

                <td> {{ server.remark }} </td>
                <td> {{ server.last_op_time }} </td>
                <td> {{ server.last_op_people }} </td>
                <td> {{ server.service_id }} </td>
                <td> {{ server.server_purpose }} </td>

                <td> {{ server.trouble_resolve }} </td>
                <td> {{ server.appop_interface_other }} </td>
                <td> {{ server.dev_interface }} </td>
                <td> {{ server.check_update_time }} </td>
                <td> {{ server.power }} </td>
                </tr>
            {% endfor %}

      </tbody>
    </table>
</div>
</div>



<div class="modal fade" id="update" aria-hidden="true">
	<div class="modal-dialog">
	    <div class="modal-content">

            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">×</button>
                <h4>同步到zabbix</h4>
            </div>
            <div class="modal-body">
                <div id="host_list" ></div>
                <select class="form-control" id="zabbix_group">
                </select>
                <br>
                <br>
                <button class="btn btn-primary" id="create">提交</button>
            </div>
            <div class="modal-footer">
                <input class="btn btn-default" data-dismiss="modal" aria-hidden="true" type="button" value="取消">
            </div>

        </div>
    </div>
</div>




{% endblock %}
{% block js %}
    <script type="text/javascript" charset="utf8" src="/static/js/jquery.dataTables.min.js"></script>
    <script type="text/javascript" charset="utf8" src="/static/js/dataTables.bootstrap.js"></script>
    <script src="/static/js/sweetalert.min.js"></script>
    <link rel="stylesheet" type="text/css" href="/static/css/sweetalert.css">  

    <script>
    $(function(){
        $('#table_id').DataTable({
            "sScrollX":"5000px",
            "language":{
                    "lengthMenu":"每页 _MENU_ 条记录",
                    "zeroRecords":"没有找到记录",
                    "sInfo":"第 _PAGE_ 页 ( 总共 _PAGES_ 页),显示第 _START_ 至 _END_ 项(总共 _TOTAL_ 项目)",
                    "infoEmpty":"无记录",
                    "infoFiltered":"(从 _MAX_ 条记录过滤)",
                    "sSearch":"搜索:",
                    "oPaginate":{
                        "sFirst":"首页",
                        "sPrevious":"上一页",
                        "sNext":"下一页",
                        "sLast":"末页"
                    }
                }
        });


        $("#server_to_zabbix_btn").click(function(){
            $('#update').modal('show');
            zabbix_group = $("#zabbix_group");
            sync_host_list = $("#host_list");
            $.post('/resource/monitor/ajax/get_sync_zabbix_hosts', function(data){
                sync_host_list.empty();
                server_list = JSON.parse(data);
                $.each(server_list, function(n, obj){
                    html = '<div class="checkbox">';
                    html += '<label>';
                    html += '<input type="checkbox" name="zabbix_hosts" class="zabbix_hosts" value="'+obj.id+'">';
                    html += obj.hostname;
                    html += '</label>';
                    html += '</div>';
                    sync_host_list.append(html);
                });
            });
            $.post("/monitor/ajax/get_zabbix_host_groups",function(data){
                zabbix_group.empty();
                groups = JSON.parse(data);
                $.each(groups, function(n, obj){
                    zabbix_group.append("<option value='"+obj.groupid+"'>"+obj.name+"</option>");
                });
            })
        });

        $("#create").click(function(){
            hostids = new Array();
            $("input[name='zabbix_hosts']:checked").each(function (i, n) {
                hostids[i] = n.value
            });
            zabbix_groupid = $("#zabbix_group").val();
            $.post("/resource/monitor/ajax/sync_host_to_zabbix",{hostids:hostids.toString(), groupid:zabbix_groupid},
                    function(data){
                        $('#update').modal('hide');
                        if(data == 1){
                            swal("添加成功!", "", "success");

                        }else{
                            swal("添加失败", data, "error")
                        }
                    });
        })
    });

    </script>
{% endblock %}
